<template>
  <div class="hader">
    <div class="box">
      <div class="left">
        <h2>叩叮狼商品管理系统<i class="el-icon-menu"></i></h2>
      </div>
      <div class="right">
        <el-dropdown @command="exitfn" trigger="click">
          <span class="el-dropdown-link">
            admin<i class="el-icon-arrow-down el-icon--right"></i>
          </span>
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item>退出登录</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
      </div>
    </div>
  </div>
</template>
 
<script>
export default {
  data() {
    return {};
  },
  methods: {
    exitfn() {
      console.log(123);
      this.$router.push("/login");
    },
  },
};
</script>
 
<style lang = "less" scoped>
.hader {
  background-color: #409eff;

  width: 100%;
  .box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #fff;
    padding: 20px 20px;
  }
}
.el-icon-menu {
  margin-left: 10px;
}
.el-dropdown-link {
  color: #fff;
}
</style>